<template>
    <el-dialog
        :visible.sync="visible.show"
        :title="title"
        :width="width"
        append-to-body
        :close-on-click-modal="closeCliseModal"
    >
        <slot></slot>
        <div slot="footer" class="dialog-footer" v-if="!hideButton">
                <el-button @click="cancel">{{cancelText}}</el-button>
                <el-button type="primary" @click="confirm">{{confirmText}}</el-button>
        </div>
    </el-dialog>
</template>
<script>
export default {
    name: 'normalDialog',
    props: {
        visible: {
            type: Object,
            default () {
                return {
                    show: false
                }
            }
        },
        hideButton: {
            type: Boolean,
            default () {
                return false
            }
        },
        title: {
            type: String
        },
        width: {
            type: [String,Number],
            default () {
                return '620px'
            }
        },
        closeCliseModal: {
            type: Boolean,
            default () {
                return false
            }
        },
        cancelText: {
            type: String,
            default () {
                return '取消'
            }
        },
        confirmText: {
            type: String,
            default () {
                return '确定'
            }
        }
    },
    methods: {
        confirm () {
            this.$emit('confirm')
        },
        cancel () {
            this.visible.show = false
            this.$emit('cancel')
        }
    }

}
</script>
<style lang="scss" scoped>
::v-deep .el-dialog__body {
    padding: 20px !important;
}
</style>